<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>scrollfix test</title>
	<style type="text/css">
	.main{position: relative; width: 800px; margin:0 auto;}
	.content{float: left; width:480px; border:1px solid #ddd;}
	.main:before, .main:after{display: table; content:"";}
	.main:after{clear: both;}
	.sidebar{float: right; width:280px; border:1px solid #ddd; position: relative;}
	.widget{padding:10px; margin-bottom: 20px;}
	.footer div{ width:800px; margin: 100px auto;}
	</style>
	
</head>
<body>
	<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid nisi amet recusandae provident nostrum eius eum debitis facere, consequuntur tempore eos, atque eaque ab. Rem, quod, ducimus! Eveniet, laudantium laborum!</div>
	<div>Iusto enim voluptates placeat, accusamus cumque suscipit blanditiis odit distinctio laborum doloribus dolor, alias accusantium illum numquam quis sequi consectetur dicta. Quae molestiae reprehenderit officia fugit totam culpa nesciunt voluptas.</div>
	<div>Reiciendis placeat ducimus fugit porro sit suscipit assumenda veritatis, nam ab debitis quasi maiores animi quos sint reprehenderit, consequuntur quia! Debitis quasi, rem expedita, reprehenderit maxime voluptatum ducimus culpa impedit?</div>
	Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quos sit laboriosam officiis nesciunt quo, error delectus aperiam eius, consequuntur quidem dolore, quod soluta minus nisi quibusdam possimus est debitis! Repellat.
	<div class="main">
		<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis inventore veritatis nam distinctio beatae totam quia esse molestias, ea, dolor, autem dignissimos amet quibusdam excepturi deleniti rerum perspiciatis? Tenetur, rerum!</div>
		<div>Nulla perferendis et eos dicta voluptatem temporibus sed est inventore fugit tempora animi amet commodi harum mollitia possimus eaque sint praesentium laudantium architecto, laboriosam neque beatae omnis! Laudantium repudiandae, repellendus!</div>
		<div class="content">
			<div class="widget" id="s1">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Error excepturi pariatur illo eligendi doloribus neque, dolorum, itaque, rerum libero atque quod nobis labore totam id sequi odit alias repudiandae. Doloribus.</div>
		<div>Molestias itaque velit modi dolore exercitationem commodi unde. Ducimus deserunt, delectus asperiores praesentium quam eveniet ratione. Provident necessitatibus, quas dolorum incidunt voluptates, mollitia nulla quidem quod ullam culpa cumque sequi!</div>
		<div>Amet odit, sunt dignissimos sapiente eligendi quisquam, qui nisi, cupiditate fuga, laboriosam exercitationem ea optio nostrum maiores iusto perferendis. Velit suscipit placeat perspiciatis ab fugit architecto iusto earum numquam nesciunt!</div>
		<div>Doloremque possimus aspernatur accusantium aperiam, perferendis minus, beatae fugiat fugit officia aliquam praesentium amet quia dolore, nostrum laborum perspiciatis ipsa delectus error iusto adipisci ratione! Dolores non, veritatis nobis! Molestias?</div>
		<div>Tempore ipsum culpa repellendus inventore maiores at reprehenderit saepe fuga molestias repellat suscipit odio, necessitatibus officiis facilis adipisci accusamus sit excepturi voluptatibus, laudantium, minima pariatur ducimus. Id quibusdam placeat quo.</div>
		<div>Explicabo quaerat culpa, ducimus voluptatibus illo nostrum consequuntur pariatur non accusantium minus ad sunt omnis deleniti dicta obcaecati animi saepe odit fugiat fuga possimus quo iusto dolores! Voluptate, maxime, facilis!</div>
		<div>Officiis, non. Id neque ratione placeat magni, magnam illo, necessitatibus ad dicta deleniti tenetur quibusdam quasi fugiat ea quas dolor inventore quia eum voluptatum tempora. Rem libero, suscipit quos nobis.</div>
		<div>Reiciendis placeat sapiente, veritatis repellat omnis, pariatur molestiae ab sint harum! Voluptatibus, commodi nam vel nulla aperiam rem itaque laborum, quisquam debitis assumenda facere sapiente, inventore ex, aspernatur eos praesentium!</div>
		<div>Magni consectetur nam veniam qui provident ullam tempora reiciendis quo ipsa, ex corporis quia unde alias esse aperiam maiores non ipsam tempore sit facilis, consequuntur dolore ratione id. Labore, doloribus.</div>
		<div>Quisquam magnam beatae rem quasi distinctio quam ratione impedit, quo quod temporibus, nisi exercitationem voluptas consequatur soluta, eaque. Asperiores quaerat aliquid voluptatem quas magni doloribus, optio consectetur accusamus nemo earum?</div>
		<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium quidem suscipit eum. Id numquam eaque, voluptatum illo fuga repellendus atque nesciunt quam neque itaque asperiores ab quibusdam dignissimos error accusamus.</div>
		<div>Eveniet consequuntur, possimus saepe. Quia, vitae magni facere. Incidunt quidem velit ex odio, nostrum doloribus minima alias repellat provident labore laudantium nesciunt voluptas sint nam deleniti in consequatur fugit illum!</div>
	</div>
		<div class="sidebar">
			<div class="widget">
				<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus facilis aliquam sapiente voluptatibus dignissimos, quisquam sequi culpa autem atque! Perspiciatis odit delectus ad qui corporis dolor exercitationem. Itaque eligendi, accusantium.</div>
				<div>Asperiores nostrum possimus maxime autem dolor minima tempora eveniet nemo minus reiciendis expedita, quo, magnam numquam magni, delectus quos eligendi quam dolorum in aliquam consequatur deleniti. Expedita animi ipsa consectetur?</div>
			</div>
			<div class="widget">
			<div>Vel ipsum repellendus molestias sint, rem perferendis. Enim laboriosam consequatur culpa exercitationem repellat commodi! Nesciunt aliquid beatae quas, sunt, esse error atque eveniet delectus hic in excepturi veniam quidem ad.</div></div>
			<div class="widget" id="s2"><div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum voluptatem esse at culpa repellat ullam nobis doloribus, non beatae. Explicabo dolorum at voluptates, fugiat inventore corporis minima dolores, animi hic?</div>
			<div>Vel ipsum repellendus molestias sint, rem perferendis. Enim laboriosam consequatur culpa exercitationem repellat commodi! Nesciunt aliquid beatae quas, sunt, esse error atque eveniet delectus hic in excepturi veniam quidem ad.</div></div>
		</div>
	</div>
	<div class="footer">
		<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Natus expedita, facilis sit accusamus dicta aut aliquid dolorem quod illo autem laudantium rem ea deserunt, id dolores eligendi facere sint magnam!</div>
		<div>Deleniti harum nesciunt, consequuntur quis inventore. Molestias unde quaerat temporibus ipsam, doloremque autem porro aperiam magnam repellendus veniam, consequatur similique, cupiditate quae rerum culpa nulla veritatis impedit. Pariatur, provident, nulla.</div>
		<div>Optio laboriosam voluptatibus quas amet sed quam repellat quis, possimus ab cum deleniti voluptas commodi debitis quos veniam adipisci aliquam totam sint molestias doloribus nesciunt. Sequi debitis praesentium quae magni!</div>
		<div>Eligendi, perferendis dolorum voluptates beatae. Modi sed repudiandae ex voluptates dolore, natus, harum doloremque possimus pariatur aperiam eaque nulla ducimus consequuntur. Officia necessitatibus voluptatem ipsam quas eius quod, aut distinctio?</div>
		<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi ab numquam sapiente minima sed necessitatibus eos! Voluptate cum doloribus cumque laborum natus est eum quae, officia similique accusantium vero reprehenderit.</div>
		<div>Facere rerum quibusdam provident tempore perspiciatis itaque cumque eum, saepe commodi impedit vitae neque quisquam dicta vero eius, laboriosam harum, animi vel eaque ipsa ex quas voluptates repellendus obcaecati excepturi!</div>
		<div>Necessitatibus inventore laborum, ea obcaecati eligendi voluptates nam, fugiat ad, asperiores iure laboriosam odio, temporibus distinctio? Iste provident, aspernatur excepturi fugit veniam magni, voluptatem in vel animi consequatur laboriosam reprehenderit.</div>
		<div>Veritatis cupiditate debitis consequuntur in explicabo asperiores eum aliquid, provident molestias, velit amet similique ipsum porro quam dolor exercitationem nam architecto quasi quis iusto voluptate, natus reiciendis soluta. Ab, cupiditate.</div>
	</div>
	<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
	<script type="text/javascript" src="scrollfix.js"></script>
	<script type="text/javascript">
	$(function(){
		$("#s1").scrollfix();
		$("#s2").scrollfix();
	})
	</script>
</body>
</html>